import { createElement, HTMLAttributes, type FC } from 'react';
import classNames from 'classnames';

import { textDefaultProps } from './defaultProps';
import type { TextOptions } from './type';

export interface TextProps extends TextOptions, Omit<HTMLAttributes<HTMLSpanElement>, 'color'> {}

const Text: FC<TextProps> = (props) => {
  const { className, color, type, size, inverted, children, forwardedRef, ...textProps } = props;

  return createElement(
    'span',
    {
      ref: forwardedRef,
      className: classNames('ui', { inverted }, color, type, size, 'text', className),
      ...textProps,
    },
    children,
  );
};

Text.displayName = 'Text';
Text.defaultProps = textDefaultProps;

export default Text;
